<template>
  <div class="box">
    <el-breadcrumb separator="/">
      <el-breadcrumb-item to="/login" replace>首页</el-breadcrumb-item>
      <el-breadcrumb-item to="/login/user" replace>用户管理</el-breadcrumb-item>
      <el-breadcrumb-item>信审资料</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="tableBox">
      <div class="tableTitle">信审资料</div>
      <el-row>
        <el-col :span="12">
          <el-row>
            <el-col :span="6">真实姓名</el-col>
            <el-col :span="18">李炜铜</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">年龄</el-col>
            <el-col :span="18">20</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">性别</el-col>
            <el-col :span="18">男</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">婚否</el-col>
            <el-col :span="18">未婚</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">家庭住址</el-col>
            <el-col :span="18">山西省长治市长治县荫城镇XX村</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">身份证号</el-col>
            <el-col :span="18">140421199804216531</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">工作性质</el-col>
            <el-col :span="18">工人：公司职员；公务员/单位；私营业主；其他</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">职位</el-col>
            <el-col :span="18">几层人员;中级管理人员；高级管理人员</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">工作单位</el-col>
            <el-col :span="18">信用付金融服务有限公司</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">单位地址</el-col>
            <el-col :span="18">长治市西二环96号信用付</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">第一联系人姓名</el-col>
            <el-col :span="18">李炜铜</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">关系</el-col>
            <el-col :span="18">同学</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">手机号</el-col>
            <el-col :span="18">15034067564</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">第二联系人姓名</el-col>
            <el-col :span="18">李炜铜</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">关系</el-col>
            <el-col :span="18">朋友</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">手机号</el-col>
            <el-col :span="18">15093229071</el-col>
          </el-row>
        </el-col>
        <el-col :span="12">
          <el-row>
            <el-col :span="6">身份证正面</el-col>
            <el-col :span="18"><img src="./ID-card-front.jpg" alt=""></el-col>
          </el-row>
          <el-row>
            <el-col :span="6">身份证反面</el-col>
            <el-col :span="18"><img src="./ID-card-anti-.jpg" alt=""></el-col>
          </el-row>
          <el-row>
            <el-col :span="6">手持身份证自拍</el-col>
            <el-col :span="18"><img src="./Handheld-ID-card-selfie.jpg" alt=""></el-col>
          </el-row>
          <el-row>
            <el-col :span="6">WECHAT</el-col>
            <el-col :span="18">18235680201</el-col>
          </el-row>
          <el-row>
            <el-col :span="6">QQ</el-col>
            <el-col :span="18">969651648</el-col>
          </el-row>
        </el-col>
      </el-row>
      <div class="content">
        <el-row>
          <el-col :span="4">芝麻评分</el-col>
          <el-col :span="10">无</el-col>
          <el-col :span="10">当前认证状态:未提交</el-col>
        </el-row>
        <el-row>
          <el-col :span="4">芝麻评分</el-col>
          <el-col :span="10"><img src="./Handheld-ID-card-selfie.jpg" alt=""></el-col>
          <el-col :span="10"></el-col>
        </el-row>
        <el-row>
          <el-col :span="4">行车证</el-col>
          <el-col :span="10">无</el-col>
          <el-col :span="10">当前认证状态:未提交</el-col>
        </el-row>
      </div>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  export default {
    data () {
      return {
        tableData: []
      }
    },
    created () {}
  }
</script>

<style lang="less" ref="stylesheet/less" scoped>
  .el-row{
    display: flex;
    text-align: center;
    .el-col{
      .el-row{
        .el-col{
          display: flex;
          justify-content: center;
          align-items: center;
          padding: 20px 0;
          border-right: 1px solid #eee;
          border-bottom: 1px solid #eee;
        }
      }
      &:last-child{
        .el-row{
          .el-col{
            &:last-child{
              padding: 22px 0;
              border-right: none;
            }
          }
        }
      }
    }
  }
  .content{
    .el-row{
      display: flex;
      .el-col{
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 20px 0;
        border-right: 1px solid #eee;
        border-bottom: 1px solid #eee;
        &:last-child{
          border-right: none;
        }
      }
    }
  }
</style>
